<template>
	<div>
		<Modal :width="950" :title="info.title" v-model="info.show" :mask-closable="false" :styles="{top: '20px'}">
			<Tabs type="card" :animated="false" @on-click="tabsSwitch">
	        <TabPane label="基本信息">
	        	<div class="ivu-card-head"><h3>用户信息</h3></div>
				<Form :model="formItem" :label-width="80" label-position="left"  class="form">
					<Row>
						<Col span="8">
							<FormItem label="会员编号">
								{{info.formItem.serialNumber}}
							</FormItem>
							<FormItem label="行      业">
								{{info.formItem.industry}}
							</FormItem>
							<FormItem label="公司性质">
								{{info.formItem.enterprise_nature}}
							</FormItem>
							<FormItem label="酒店地址">
								{{info.formItem.organization_province}}
								{{info.formItem.organization_city}}
								{{info.formItem.organization_county}}
								{{info.formItem.organization_street}}
							</FormItem>
							<FormItem label="营业执照附件" :label-width="90">
								<div class="info-img">
									<img :src="info.formItem.business_license" />
								</div>
							</FormItem>
						</Col>
						<Col span="8">
							<FormItem label="公司名称">
								{{info.formItem.enterprise_name}}
							</FormItem>
							<FormItem label="酒店名称">
								{{info.formItem.organization_name}}
							</FormItem>
							<FormItem label="联系人">
								{{info.formItem.contact}}
							</FormItem>
							<FormItem label="银行账户">
								{{info.formItem.contact}}
							</FormItem>
						</Col>
						<Col span="8">
							<FormItem label="营业执照">
								{{info.formItem.social_credit_code}}
							</FormItem>
							<FormItem label="公司地址">
								{{info.formItem.enterprise_province}}
								{{info.formItem.oenterprise_city}}
								{{info.formItem.enterprise_county}}
								{{info.formItem.enterprise_street}}
							</FormItem>
							<FormItem label="联系电话">
								{{info.formItem.phone}}
							</FormItem>
							<FormItem label="用户类型">
								{{info.formItem.accountStatus}}用户
							</FormItem>
						</Col>
					</Row>
				</Form>
				<div class="ivu-card-head"><h3>账户信息</h3></div>
				<Form :model="formItem" :label-width="80" label-position="left" class="form">
					<Row :gutter="30">
						<Col span="8">
							<FormItem label="注册账号">
								{{info.formItem.username}}
							</FormItem>
						</Col>
						<Col span="12">
							<FormItem label="登录密码">
								{{info.formItem.password}}
							</FormItem>
						</Col>
					</Row>
				</Form>
				<div class="ivu-card-head"><h3>推荐人/销售信息</h3></div>
				<Form :model="formItem" :label-width="80" label-position="left" class="form">
					<FormItem label="推荐人">
						{{info.formItem.referrer}}
					</FormItem>
				</Form>
				 <Row type="flex" justify="end" class="code-row-bg">
				 	<Col span="4" v-show="info.status=='4'?true:false"><Button type="warning" @click="enable(info.id)">禁用</Button></Col>
			        <Col span="4" v-show="info.status=='1'?true:false"><Button type="success" @click="pass(info.id)">审核通过</Button></Col>
			        <Col span="4" v-show="info.status=='1'||info.status=='2'?true:false"><Button type="warning" @click="notPass(info.id)">审核不通过</Button></Col>
			        <Col span="4" v-show="info.formItem.accountStatus=='5'?false:true"><Button type="error">加入黑名单</Button></Col>
			    </Row>
				
	        </TabPane>
	        <TabPane label="订单信息">
				    <!--<Table border  :loading="loading" :columns="columns" :data="list"></Table>-->
	        </TabPane>
	        <TabPane label="操作日志" v-if="info.formItem.accountStatus=='待审核'?false:true">
	        	123
				    <!--<Table border  :loading="loading" :columns="columns" :data="list"></Table>-->
	        </TabPane>
			</Tabs>
			<div slot="footer" style="text-align: center;">
				<Button type="ghost" @click="()=>{info.show=false}">关闭</Button>
			</div>
		</Modal>
	</div>
</template>

<script>
	export default {
		props: ['info'],
		data() {
			return {
				formItem: {
					"accountStatus": "",
				    "business_license": "",
				    "contact": "",
				    "email": "",
				    "enterprise_city": "",
				    "enterprise_county": "",
				    "enterprise_name": "",
				    "enterprise_nature": "",
				    "enterprise_province": "",
				    "enterprise_street": "",
				    "industry": "",
				    "organization_city": "",
				    "organization_county": "",
				    "organization_name": "",
				    "organization_province": "",
				    "organization_street": "",
				    "password": "",
				    "phone": "",
				    "referrer": "",
				    "serialNumber": "",
				    "social_credit_code": "",
				    "username": ""
				},
			}
		},
		methods: {
			tabsSwitch(name){
        		if(name==0){
        			this.status="0";
        			console.log("shenghe");
        		}else if(name==1) {
        			this.status="1";
        			console.log("yishenghe");
        		}else{
        			this.status="2";
        		}
        	},
        	enable (index) {
                this.$Modal.confirm({
                    title: '确认禁用',
                    content: '<p>是否禁用该用户</p>',
                    onOk: () => {
                        this.$ajax({
							url: "/user_management/enableById/"+index,
							method: "get",
							data: ""
						}).then((d) => {
							if(d.message==="success"){
								this.$Message.success('禁用成功');
								this.refreshData()
							}else{
								this.$Message.warning(d.message);
							}
						})
                    },
                    onCancel: () => {
                    }
                });
            },
        	pass (index) {
                this.$Modal.confirm({
                    title: '确认审核通过',
                    content: '<p>是否确认审核通过</p>',
                    onOk: () => {
                    	console.log(index);
                        this.$ajax({
							url: "/user_management/auditPass/"+index,
							method: "get",
							data: ""
						}).then((d) => {
							if(d.isSuccess===true){
								this.$Message.success('审核通过成功');
								this.info.show=false;
								this.$emit('upup');
								console.log("chenggong")
							}else{
								this.$Message.warning(d.message);
							}
						})
                    },
                    onCancel: () => {
                    }
                });
            },
            notPass(index) {
            	 this.$Modal.confirm({
                    title: '确认审核不通过',
                    content: '<p>是否确认审核不通过</p>',
                    onOk: () => {
                        this.$ajax({
							url: "/user_management/auditNotPass/"+index,
							method: "get",
							data: ""
						}).then((d) => {
							if(d.isSuccess===true){
								this.$Message.success('审核不通过成功');
								this.info.show=false;
								this.$emit('upup');
							}else{
								this.$Message.warning(d.message);
							}
						})
                    	console.log(index);
                    },
                    onCancel: () => {
                    }
                });
            },
			save() {
				console.log("save");
//				var _data = {
//					"edu_background": "本科",
//					"employee_num": "0007",
//					"graduate_school": "杭州师范大学",
//					"id_card": "330354187714158794",
//					"id_card_photo": "http://imgtu.5011.net/uploads/content/20170414/6256421492148399.jpg",
//					"leaving_date": "2017-10-27",
//					"market": "|1|2|3|",
//					"name": "光头强",
//					"phone": "13783654321",
//					"photo": "http://imgtu.5011.net/uploads/content/20170414/6256421492148399.jpg",
//					"region": "杭州",
//					"report_date": "2017-10-27",
//					"sex": "male",
//					"status": "working",
//					"tenant_id": "1"
//				}
				this.$ajax({
					url: "http://101.132.156.26:1000/employee",
					method: this.info.method,
					data: this.info.formItem
				}).then((d) => {
					console.log(d);
					if(d.message === "success") {
						this.$Message.success('保存成功');
						this.info.show = false;
						this.$emit('upup');
						console.log("chenggong")
					} else {
						this.$Message.warning(d.message);

					}
				})
			}
		},
		componets: {

		},
		mounted() {}
	}
</script>

<style lang="less" scoped>
	.form{
		margin-left: 80px;
		margin-top: 10px;
	}
	.info-img{
		width: 100px;
		height: 50px;
		padding: 16px;
		img{
			width: 100%;
		}
	}
	.ivu-modal-header,.ivu-modal-footer{
		border: none;
	}
</style>